<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>详情页</title>
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">     
	<meta content="yes" name="apple-mobile-web-app-capable">     
	<meta content="black" name="apple-mobile-web-app-status-bar-style">     
	<meta content="telephone=no" name="format-detection">
	<link rel="shortcut icon" href="/favicon.ico">
	<link rel="stylesheet" type="text/css" href="/H5/css/sm.min.css?v=10" />
	<link rel="stylesheet" type="text/css" href="/H5/css/reset.css?v=10" />
	<link rel="stylesheet" type="text/css" href="/H5/css/details.css?v=14" />
</head>
<body>
	<div class="page-group ms-controller" :controller="detial">
        <div class="page page-current">
            <header class="bar bar-nav">
              	<a class="icon icon-left pull-left" href="javascript:window.history.go(-1);"></a>
              	<a class="icon icon-home pull-right" href="/H5"></a>
              	<h1 class="title">{{@data.title||""}}</h1>
            </header>
            <div class="content visibility">
    			<div class="details">
                	<div class="details_header"><img onerror="$(this).css('display','none')" /></div>
                    <div class="details_title">
                    	<div>
                        	<p>{{@data.title||""}}</p>
                        	<span>{{@data.intro||""}}</span>
                        </div>
                    </div>
                    <ul class="money">
                    	<li style="width: 35%; font-size: .7rem;">会员价:<span class="red">￥{{@data.sell_price||""}}</span></li>
                    	<li style="font-size: .7rem;">市场价:<span class="through">￥{{@data.market_price||""}}</span></li>
                    	<li style="width: 25%; font-size: .7rem;">销售量:{{@data.sell_num||""}}</li>
                    	<li style="font-size: .6rem; width: 45%">
                    		<span :visible="@data.give_point>0" class="green" style="border-color: #4cd964">赠送积分+{{@data.give_point||""}}</span>
                    		<span :visible="@data.deviation_point>0" class="green" style="color: red">抵扣积分-{{@data.deviation_point||""}}</span>
                    		<span class="green" style="margin-left: 2px;border-color: #4cd964">贡献+{{@data.contribution||""}}</span>
                    	</li>
                    	<li style="width: 27%; font-size: .7rem; line-height: 40PX;"><span :visible="@data.postage>0">运费：{{@data.postage}}</span></li>
                    	<li style="width: auto; font-size: .7rem;"><a :attr="{'href': '/H5/cart?id='+@param}">立即购买</a></li>
                    </ul>
                    <p class="details_main_p">商品详情</p>
                    <div class="details_main">
                    </div>
                </div> 
            </div>
        </div>
    </div>
	<script type='text/javascript' src='/H5/js/zepto.min.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/sm.min.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/avalon.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/simpleStorage.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/mall.js' charset='utf-8'></script>
    <script>
		var detial = avalon.define({
		    $id: "detial",
		    data: {},
		    param: window.location.href.split("=")[1],
		    getDetail: function(){
		    	Mall.request( "/api/GoodsDetail", {goods_id: detial.param} )
		    		.always( function( data ){
		    			if( data.error_code == 0 ){
		    				detial.data = data.data;
		    				$( ".content" ).removeClass( "visibility" );
		    				$( ".details_header img" ).attr("src", data.data.picture_urls[0]);
		    				$( ".details_main" ).append(data.data.detail);
		    			}
		    			else{
		    				$.alert(data.error_msg)
		    			}
		    		} )
		    }
		    
		})
		detial.getDetail();
		avalon.scan( document.body );
    </script>
</body>
</html>
